<template>
	<view class="game-box"
		:style="`background:url('${mapUrl}');background-size: cover;background-repeat: no-repeat;background-position: center;`">
		<!-- #ifdef H5 -->
		<astar class="astar" ref="astarEl" :cubeWidth="cubeWidth" :wallArr="wallArr" :initPosition="initPosition" @movePosition="movePosition">
		</astar>
		<!-- #endif -->
		<!-- #ifdef APP||MP -->
		<astar class="astar mobile" ref="astarEl" :cubeWidth="cubeWidth" :wallArr="wallArr"
			:initPosition="initPosition" @movePosition="movePosition"></astar>
		<!-- #endif -->
		<jing-ling v-for="item in jingLingPosition" :key="item"
			:style="`position: absolute;height:${cubeWidth*5}px;width:${cubeWidth*5}px;`" :cubeWidth="cubeWidth"
			class="clickJingLing" :initPosition="item" :jingLingInfo="jingLingInfo"
			@clickJingLing="clickJingLing"></jing-ling>
	</view>
</template>

<script setup>
	import {
		onMounted,
		ref,
		watchEffect
	} from "vue";
	import astar from "../../components/A_Star";
	import jingLing from "../../components/jing_ling/jing_ling.vue"
	import utils from "@/pages/common/utils.js";
	import {
		usePiniaStore
	} from "../../store";
	components: {
		astar,
		jingLing
	}

	const cubeWidth = ref(10)
	const mapUrl = ref("")
	const wallArr = ref([])
	const initPosition = ref([])
	const jingLingPosition = ref([])
	const jingLingInfo = ref({})
	const astarEl = ref(null)
	const levelRegion = ref([])
	const rolePosition = ref([])
	const emit = defineEmits(["goFight"])
	const store = usePiniaStore()
	onMounted(() => {
		init()
	})

	const init = () => {
		//初始化以及切换地图时需要请求地图数据包括不限于地图文件、墙体数组、基础等级、精灵、初始位置    考虑是否添加资源类型
		//精灵位置则再非墙体间随机生成取墙体数组第一个和最后一个之间的值
		uni.showLoading({
			title: "请求地图数据.."
		})
		setTimeout(() => {
			//84-38   10
			let res = {
				mapUrl:"@/static/image/map1.png",
				levelRegion:[5,12],  //10-15的区间  第一个跨度  第二个为初始等级
				wallArr: [
					[84, 38],
					[83, 38],
					[82, 38],
					[81, 38],
					[80, 38],
					[79, 38],
					[78, 38],
					[77, 38],
					[76, 38],
					[75, 38],
					[74, 38],
					[73, 38],
					[72, 38],
					[71, 38],
					[70, 38],
					[69, 38],
					[68, 38],
					[67, 38],
					[66, 38],
					[65, 38],
					[64, 38],
					[63, 38],
					[62, 38],
					[61, 38],
					[60, 38],
					[59, 38],
					[58, 38],
					[57, 38],
					[56, 38],
					[55, 38],
					[54, 38],
					[53, 38],
					[52, 38],
					[51, 38],
					[50, 38],
					[49, 38],
					[48, 38],
					[47, 38],
					[46, 38],
					[45, 38],
					[44, 38],
					[43, 38],
					[42, 38],
					[41, 38],
					[40, 38],
					[39, 38],
					[38, 38],
					[37, 38],
					[36, 38],
					[35, 38],
					[34, 38],
					[33, 38],
					[32, 38],
					[31, 38],
					[30, 38],
					[29, 38],
					[28, 38],
					[27, 38],
					[26, 38],
					[25, 38],
					[24, 38],
					[23, 38],
					[22, 38],
					[21, 38],
					[20, 38],
					[19, 38],
					[18, 38],
					[17, 38],
					[16, 38],
					[15, 38],
					[14, 38],
					[13, 38],
					[12, 38],
					[11, 38],
					[10, 38],
					[9, 38],
					[8, 38],
					[7, 38],
					[6, 38],
					[5, 38],
					[4, 38],
					[3, 38],
					[2, 38],
					[1, 38],
					[0, 38],
					[84, 37],
					[83, 37],
					[1, 37],
					[0, 37],
					[84, 36],
					[83, 36],
					[1, 36],
					[0, 36],
					[84, 35],
					[83, 35],
					[1, 35],
					[0, 35],
					[84, 34],
					[83, 34],
					[1, 34],
					[0, 34],
					[84, 33],
					[83, 33],
					[1, 33],
					[0, 33],
					[84, 32],
					[83, 32],
					[1, 32],
					[0, 32],
					[84, 31],
					[83, 31],
					[1, 31],
					[0, 31],
					[84, 30],
					[83, 30],
					[1, 30],
					[0, 30],
					[84, 29],
					[83, 29],
					[1, 29],
					[0, 29],
					[84, 28],
					[83, 28],
					[1, 28],
					[0, 28],
					[84, 27],
					[83, 27],
					[1, 27],
					[0, 27],
					[84, 26],
					[83, 26],
					[1, 26],
					[0, 26],
					[84, 25],
					[83, 25],
					[1, 25],
					[0, 25],
					[84, 24],
					[83, 24],
					[1, 24],
					[0, 24],
					[84, 23],
					[83, 23],
					[1, 23],
					[0, 23],
					[84, 22],
					[83, 22],
					[1, 22],
					[0, 22],
					[84, 21],
					[83, 21],
					[1, 21],
					[0, 21],
					[84, 20],
					[83, 20],
					[1, 20],
					[0, 20],
					[84, 19],
					[83, 19],
					[1, 19],
					[0, 19],
					[84, 18],
					[83, 18],
					[1, 18],
					[0, 18],
					[84, 17],
					[83, 17],
					[54, 17],
					[53, 17],
					[52, 17],
					[51, 17],
					[50, 17],
					[1, 17],
					[0, 17],
					[84, 16],
					[83, 16],
					[1, 16],
					[0, 16],
					[84, 15],
					[83, 15],
					[1, 15],
					[0, 15],
					[84, 14],
					[83, 14],
					[1, 14],
					[0, 14],
					[84, 13],
					[83, 13],
					[1, 13],
					[0, 13],
					[84, 12],
					[83, 12],
					[1, 12],
					[0, 12],
					[84, 11],
					[83, 11],
					[1, 11],
					[0, 11],
					[84, 10],
					[83, 10],
					[1, 10],
					[0, 10],
					[84, 9],
					[83, 9],
					[1, 9],
					[0, 9],
					[84, 8],
					[83, 8],
					[1, 8],
					[0, 8],
					[84, 7],
					[83, 7],
					[1, 7],
					[0, 7],
					[84, 6],
					[83, 6],
					[1, 6],
					[0, 6],
					[84, 5],
					[83, 5],
					[1, 5],
					[0, 5],
					[84, 4],
					[83, 4],
					[1, 4],
					[0, 4],
					[84, 3],
					[83, 3],
					[1, 3],
					[0, 3],
					[84, 2],
					[83, 2],
					[1, 2],
					[0, 2],
					[84, 1],
					[83, 1],
					[1, 1],
					[0, 1],
					[84, 0],
					[83, 0],
					[82, 0],
					[81, 0],
					[80, 0],
					[79, 0],
					[78, 0],
					[77, 0],
					[76, 0],
					[75, 0],
					[74, 0],
					[73, 0],
					[72, 0],
					[71, 0],
					[70, 0],
					[69, 0],
					[68, 0],
					[67, 0],
					[66, 0],
					[65, 0],
					[64, 0],
					[63, 0],
					[62, 0],
					[61, 0],
					[60, 0],
					[59, 0],
					[58, 0],
					[57, 0],
					[56, 0],
					[55, 0],
					[54, 0],
					[53, 0],
					[52, 0],
					[51, 0],
					[50, 0],
					[49, 0],
					[48, 0],
					[47, 0],
					[46, 0],
					[45, 0],
					[44, 0],
					[43, 0],
					[42, 0],
					[41, 0],
					[40, 0],
					[39, 0],
					[38, 0],
					[37, 0],
					[36, 0],
					[35, 0],
					[34, 0],
					[33, 0],
					[32, 0],
					[31, 0],
					[30, 0],
					[29, 0],
					[28, 0],
					[27, 0],
					[26, 0],
					[25, 0],
					[24, 0],
					[23, 0],
					[22, 0],
					[21, 0],
					[20, 0],
					[19, 0],
					[18, 0],
					[17, 0],
					[16, 0],
					[15, 0],
					[14, 0],
					[13, 0],
					[12, 0],
					[11, 0],
					[10, 0],
					[9, 0],
					[8, 0],
					[7, 0],
					[6, 0],
					[5, 0],
					[4, 0],
					[3, 0],
					[2, 0],
					[1, 0],
					[0, 0]
				],
				initPosition: [2, 2],
				jingLingNo: 6,
				jingLingJiNeng: {
					6: [{
							"PP": [15,15],
							"weili": 0,
							"shu_xing_No": 0,
							"name": "寄生",
							"style": "状态",
							"describe": "寄生对手，每回合吸取对方体力补充自身"
						},
						{
							"PP": [20,20],
							"weili": 30,
							"shu_xing_No": 8,
							"name": "冲撞",
							"style": "攻击",
							"describe": ""
						},
						{
							"PP": [10,10],
							"weili": 0,
							"shu_xing_No": 0,
							"name": "瞪眼",
							"style": "状态",
							"describe": "瞪大双眼恐吓对手，降低对方防御等级"
						},
						{
							"PP": [25,25],
							"weili": 50,
							"shu_xing_No": 3,
							"name": "藤鞭",
							"style": "特攻",
							"describe": ""
						}
					]
				}
			}
			mapUrl.value = res.mapUrl
			wallArr.value = res.wallArr
			levelRegion.value = res.levelRegion
			jingLingPosition.value = []
			randomPosition(res.wallArr)
			if(!rolePosition.value||rolePosition.value.length==0){
				initPosition.value = res.initPosition
			}else{
				rolePosition.value.forEach((item,index)=>{
					initPosition.value[index] = item/cubeWidth.value
				})
			}

			utils.requestCloudDB("get", {
				collection: "base_jing_ling",
				whereParam: {
					No: res.jingLingNo
				}
			}, (res1) => {
				jingLingInfo.value = res1.data[0]
				jingLingInfo.value["jingLingJiNeng"] = res.jingLingJiNeng[res1.data[0].No]
				uni.hideLoading()
			})
		}, 2000)
	}
	const randomPosition = (wallArr) => {
		let MaxX = 0
		let MaxY = 0
		wallArr.forEach(item => {
			MaxY <= item[0] ? MaxY = item[0] : MaxY
			MaxX <= item[1] ? MaxX = item[1] : MaxX
		})
		
		// jingLingPosition.value.length+1 //这个是生成的第几个精灵位置
		let randomNumY = (MaxY - 4)/3 
		let x = Number((Math.random() * (MaxX - 4) + 5).toFixed(0))
		let y = Number((Math.random() * randomNumY + (randomNumY*jingLingPosition.value.length) + 2).toFixed(0))
		if (wallArr.includes([x, y])) {
			randomPosition(wallArr)
		} else {
			jingLingPosition.value.push([x, y])
			if (jingLingPosition.value.length < 3) {
				randomPosition(wallArr)
			}
		}
	}
	const clickJingLing = (shuxing, position) => {
		//这里随机生成等级/个体值计算属性 并且进入对战状态
		let obj = {
			detail: {
				x: position.left * cubeWidth.value,
				y: position.top * cubeWidth.value
			}
		}
		astarEl.value.clickMap(obj, async () => {
			const jing_ling = await randomJingLing(shuxing)
			utils.requestCloudDB("get", {
					collection: "user_jing_ling",
					whereParam: {
						user_id: store.user_info.id,
						isPackage: true
					},
				},
				(res) => {
					emit("goFight", res.data, [jing_ling])
				})
			//这里查询当前用户精灵并且和生成精灵进入战斗状态
		})
	}

	const randomJingLing = (shuxing) => {
		return new Promise((resolve, reject) => {
			//等级区间在哪?
			shuxing.level = Number((Math.random() * levelRegion.value[0] + levelRegion.value[1]).toFixed(0))
			shuxing.ge_ti = Number((Math.random() * 30).toFixed(0))
			utils.requestCloudDB("get", {
				collection: "base_nature",
				count: true
			}, (res) => {
				let skipNum = Number((Math.random() * (res.total - 1)).toFixed(0))
					utils.randomCloudDB({
						collection: "base_nature",
						skipNum
					}, (result) => {
						store.UPDATE_NATURE_LIST(result.data)
						shuxing.xing_ge = result.data[0].name
						shuxing.xing_ge_zhi = []
						shuxing.jiNeng = result.data[0].jiNeng
						result.data[0].ratio.forEach((item, index) => {
							if (item.$numberDecimal) {
								shuxing.xing_ge_zhi[index] = item.$numberDecimal
							} else {
								shuxing.xing_ge_zhi[index] = item
							}
						})
						resolve(shuxing)
					})
			})
		})
	}
	const movePosition = (rolePositions)=>{
		rolePosition.value = rolePositions
	}
	
	defineExpose({
		init
	})
</script>

<style scoped>
	.game-box {
		/* position: absolute; */
	}

	.astar {
		z-index: -1;
		width: 375px;
		height: 667px;

	}

	.mobile {
		width: 100% !important;
		height: 100% !important;
		position: absolute;
		z-index: 2;
	}
</style>